
<template>
    <div id="tiwen">

        <mt-header  fixed title="提问" class="header">
            <router-link to="/" slot="left">
            <mt-button icon="back">返回</mt-button>
            </router-link>
        </mt-header>     


        <div id="question" class="tiwen">
          <div class="ht_xz" title="">话题选择</div>

          <select name="book_name" id="book_name" v-model="book_name">
              <option value="数学">数学</option>
              <option value="英语">英语</option>
              <option value="网页设计">网页设计</option>
              <option value="视频剪辑">视频剪辑</option>
          </select>

          <mt-field id="book_bt" name="book_bt" class="tw" placeholder="请输入标题" type="text"  v-model="book_bt"></mt-field>
          <mt-field id="book_answer" name="book_answer" placeholder="添加问题的详细内容" type="textarea" rows="10"  v-model="book_answer"></mt-field>
        <button id="ttj" @click="tijiao" class="btn btn-default btn-block">提交</button>
        </div>



    </div>
</template>

<script type="text/javascript">
    import axios from 'axios'
    import {Toast} from 'mint-ui' 
    import { Picker } from 'mint-ui';
    import {mapMutations} from "vuex"
    import  {mapState} from "vuex"

    var book_bt = document.getElementById("book_bt");

    export default {
        name: 'app',
        data :() => ({
           data: {
              book_name: "",
              book_answer: "",
              book_bt: "",
              username:""
            }
            })
        ,
        computed: {
            ...mapState({
                btn:state =>state.btn
            })
        },

        mounted(){
            this.getUser();
        },
        methods: {
       
            ...mapMutations([
                'changeBtn' // 映射 this.increment() 为 this.$store.commit('increment')
            ]),
            
            tijiao:function(){
              //存入mongo
                var params = new URLSearchParams();
                params.append('book_bt',this.book_bt );
                params.append('book_name',this.book_name );
                params.append('book_answer',this.book_answer );
                params.append('username',this.username );
                var _this = this
                //判断是否登陆
                this.$http.post('/users/user').then(function (res) {
                    if (res.data.result == 0) {
                        _this.username = '';
                        console.log('未登录')
                         _this.$router.push({path:'/login/login',query:{username:res.data.username}})
                    } else if (res.data.result == 1) {
                axios.post('/users/tiwen',params).then(function (res) {
                    if(res.data.result){
                    //成功显示  
                        Toast("success");
                        _this.user=res.data.username;
                        _this.$router.push({path:'/top',query:{username:res.data.username}})
                        _this.changeBtn();

                    }else{
                        alert("404")
                    }
                }).catch(function (err) {
                    console.log(err);
                })
                    }
                })
              },
              //获取用户名
           getUser(){
                var _this = this;
                this.$http.post('/users/user').then(function (res) {
                    if (res.data.result == 0) {
                        _this.username = '';
                        _this.sid = '';
                        _this.ressd = '0';
                        console.log('未登录')
                    } else if (res.data.result == 1) {
                        console.log('已登录')
                        console.log(res.data);
                        _this.username = res.data.username;                      
                        console.log(_this.username);


                    }
                })
               
            }
  }
    }
</script>

<style>
select{
    width:100%;
    height:30px;
    padding-left:10px;
    font-size:15px;
}
.tw{
    text-align:center;
}
.ht_xz{
margin-top:60px;
color: #339933;
font-size: 120%;
}
#ttj{
    background-color: yellowgreen;
    color: white;
    height:40px;
    width:100%;
    margin-top: 180px;
}
</style>



<style scoped>
    #tiwen{


    }



</style>